<!--
 * @Author: Bennty
 * @Date: 2024-07-15 16:13:42
 * @LastEditors: Please set LastEditors
 * @LastEditTime: 2024-09-10 15:48:52
 * @Description: 请填写简介
-->
<template>
    <div>
        <el-form>
            <el-row>
                <el-col :span="12">
                    <el-form-item label="客户名称">{{ props.data?.customerName }}</el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="联系人">{{ props.data?.linkName }}</el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="12">
                    <el-form-item label="客户体量">
                        <span class="level-one" v-if="props.data?.customerLevel == '1'">一星客户</span>
                        <span class="level-two" v-if="props.data?.customerLevel == '2'">二星客户</span>
                        <span class="level-three" v-if="props.data?.customerLevel == '3'">三星客户</span>
                        <span class="level-four" v-if="props.data?.customerLevel == '4'">四星客户</span>
                        <span class="level-five" v-if="props.data?.customerLevel == '5'">五星客户</span>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="联系电话"> {{ props.data?.linkMobile }} </el-form-item>
                </el-col>
            </el-row>
            <el-form-item label="客户来源">
                <span>
                    {{ customer_source.filter((item:any)=>item.value == props.data?.customerSource)[0]?.label }}
                </span>
            </el-form-item>
            <el-row>
                <el-col :span="12">
                    <el-form-item label="客户地址">
                        {{ `${props.data?.province}/${props.data?.city}/${props.data?.county}` }}
                    </el-form-item>
                </el-col>
                <el-col :span=12>
                    <el-form-item label="客户微信">
                        {{ props.data?.weChat }}
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="12">
                    <el-form-item label="地址详情">
                        {{ props.data?.addressDetail }}
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="备注">
                        {{  props.data?.remark }}
                    </el-form-item>
                </el-col>
            </el-row>
        </el-form>
    </div>
    
</template>

<script setup lang="ts">
const { proxy } = getCurrentInstance() as ComponentInternalInstance;

const { customer_source } = toRefs<any>(proxy?.useDict('customer_source'));

const props = defineProps(['data']);
const data = ref({
    customerName: 'HJF蛋糕',
    operator:'hjf',
    customerLevel: 3,
    phoneNumber: '18888888888',
    wx: '18888888888',
    customerSource: 1,
    customerAddress:'山东省/东营市/东营区',
    addressDetails:'山东省/东营市/东营区',
    remark:'客户比较喜欢不锈钢餐具'
});
</script>

<style lang="scss" scoped>
.level-one,.level-two {
    color:yellowgreen
}
.level-three,.level-four{
    color: orange;
}
.level-five{
    color: red
}
</style>